<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>小兔鲜儿-新鲜 惠民 快捷！</title>
    <link rel="icon" href="../favicon.ico">
    <link rel="stylesheet" href="../css/common.css">
    <link rel="stylesheet" href="../css/settle.css">
</head>

<body>
    <!-- 项部导航 -->
    <div class="xtx_topnav">
        <div class="wrapper">
            <!-- 顶部导航 -->
            <ul class="xtx_navs">
                <li>
                    <!-- 有用户名数据 -->
                    <!-- <a href="javascript:;"><i class="iconfont icon-user">用户名</i></a> -->
                    <!-- 没有用户名数据 -->
                    <a href="./login.html">请先登录</a>
                </li>
                <li>
                    <!-- 有用户名数据 -->
                    <!-- <a href="javascript:;">退出登录</a> -->
                    <!-- 没有用户名数据 -->
                    <a href="./register.html">免费注册</a>
                </li>
                <li>
                    <a href="./center.html">我的订单</a>
                </li>
                <li>
                    <a href="javascript:;">会员中心</a>
                </li>
                <li>
                    <a href="javascript:;">帮助中心</a>
                </li>
                <li>
                    <a href="javascript:;">在线客服</a>
                </li>
                <li>
                    <a href="javascript:;">
                        <i class="mobile sprites"></i>
                        手机版
                    </a>
                </li>
            </ul>
        </div>
    </div>
    <!-- 头部 -->
    <div class="xtx_header none_header">
        <div class="wrapper principal">
            <!-- 网站Logo -->
            <h1 class="xtx_logo"><a href="/">小兔鲜儿</a></h1>
            <!-- 主导航 -->
            <div class="xtx_navs">
                <ul class="clearfix">
                    <li>
                        <a href="../index.html">首页</a>
                    </li>
                    <li>
                        <a href="./atHome.html" class="entrust" data-index="0">居家</a>
                    </li>
                    <li>
                        <a href="javascript:;" class="entrust" data-index="1">美食</a>
                    </li>
                    <li>
                        <a href="javascript:;" class="entrust" data-index="2">服饰</a>
                    </li>
                    <li>
                        <a href="javascript:;" class="entrust" data-index="3">母婴</a>
                    </li>
                    <li>
                        <a href="javascript:;" class="entrust" data-index="4">个护</a>
                    </li>
                    <li>
                        <a href="javascript:;" class="entrust" data-index="5">严选</a>
                    </li>
                    <li>
                        <a href="javascript:;" class="entrust" data-index="6">数码</a>
                    </li>
                    <li>
                        <a href="javascript:;" class="entrust" data-index="7">运动</a>
                    </li>
                    <li>
                        <a href="javascript:;" class="entrust" data-index="8">杂项</a>
                    </li>
                </ul>
            </div>
            <!-- 导航下拉框 -->
            <div class="drop_down_box entrust display_none">
                <ul>
                </ul>
            </div>
            <!-- 站内搜索 -->
            <div class="xtx_search clearfix">
                <!-- 购物车 -->
                <a href="./shoppingCar.html" class="xtx_search_cart sprites">
                    <i class="red_quantity">0</i>
                </a>
                <!-- 搜索框 -->
                <div class="xtx_search_wrapper">
                    <input type="text" placeholder="搜一搜" onclick="location.href='./search.html'">
                </div>
                <div class="shopping_cart">
                    <div class="commodity">
                        <div>
                            <!-- <div class="div_entrust">
                                <a href="#">
                                    <img src="https://yanxuan-item.nosdn.127.net/ded4b153a0878527dcee27981c389929.png"
                                        alt="">
                                    <div>
                                        <p>两带式软木拖鞋</p>
                                        <p>颜色： <i>白色</i> 尺码： <i>44</i></p>
                                    </div>
                                    <div>
                                        <p>￥<i>55.9</i>元 </p>
                                        <p>X <i>1</i></p>
                                    </div>
                                </a>
                                <div class="shut_down"><i>x</i></div>
                            </div> -->

                        </div>
                    </div>
                    <section>
                        <div>
                            <p>共<i class="quantity_of_goods">0</i>件商品</p>
                            <p>￥<i class="commodity_price">0</i>元</p>
                        </div>
                        <button>去购物车结算</button>
                    </section>
                    <div class="to_settle"></div>
                </div>
                <div class="cutting">
                    <div class="triangle"></div>
                </div>
            </div>
        </div>
    </div>
    <!-- 隐藏头部 -->
    <div class="xtx_header header_fixed">
        <div class="wrapper hidden">
            <!-- 网站Logo -->
            <h1 class="xtx_logo"><a href="/">小兔鲜儿</a></h1>
            <!-- 主导航 -->
            <div class="xtx_navs">
                <ul class="clearfix">
                    <li>
                        <a href="../index.html">首页</a>
                    </li>
                    <li>
                        <a href="./atHome.html" class="entrust" data-index="0">居家</a>
                    </li>
                    <li>
                        <a href="javascript:;" class="entrust" data-index="1">美食</a>
                    </li>
                    <li>
                        <a href="javascript:;" class="entrust" data-index="2">服饰</a>
                    </li>
                    <li>
                        <a href="javascript:;" class="entrust" data-index="3">母婴</a>
                    </li>
                    <li>
                        <a href="javascript:;" class="entrust" data-index="4">个护</a>
                    </li>
                    <li>
                        <a href="javascript:;" class="entrust" data-index="5">严选</a>
                    </li>
                    <li>
                        <a href="javascript:;" class="entrust" data-index="6">数码</a>
                    </li>
                    <li>
                        <a href="javascript:;" class="entrust" data-index="7">运动</a>
                    </li>
                    <li>
                        <a href="javascript:;" class="entrust" data-index="8">杂项</a>
                    </li>
                    <li>
                        |
                    </li>
                    <li>
                        <a href="javascript:;">品牌</a>
                    </li>
                    <li>
                        <a href="javascript:;">专题</a>
                    </li>
                </ul>
            </div>
            <!-- 导航下拉框 -->
            <div class="drop_down_box display_block">
                <ul>
                </ul>
            </div>
        </div>
    </div>
    <!-- 结算页面 -->
    <section class="rotograph">
        <div class="container">
            <h3><a href="../index.html">首页</a> <i>></i> <a href="./shoppingCar.html">购物车</a> <i>></i> 填写订单</h3>
            <div class="settle_list">
                <!-- 地址 -->
                <div class="xtx_address">
                    <h3 class="box_title">收货地址</h3>
                    <div class="box_body">
                        <div class="address_list">
                            <div class="text">
                                <div class="none" style="display: block;">您需要先添加收货地址才可提交订单。</div>
                                <div class="add_block" style="display: none;">
                                    <ul>
                                        <li>
                                            <span>收货姓名：</span>
                                            <span class="add_name"></span>
                                        </li>
                                        <li>
                                            <span>联系方式：</span>
                                            <span class="add_phone"></span>
                                        </li>
                                        <li>
                                            <span>收货地址：</span>
                                            <span class="add_address"></span>
                                        </li>
                                    </ul>
                                    <a href="javascript:;" class="up_addblock">修改地址</a>
                                </div>
                            </div>
                            <div class="action">
                                <button class="exchange_add" data-name="exchange">切换地址</button>
                                <button class="insert_add" data-name="insert">添加地址</button>
                            </div>
                        </div>
                        <div class="insert">
                            <div class="pop_con">
                                <div class="pop_title">
                                    <h3>添加收货地址</h3>
                                    <i class="cancel">X</i>
                                </div>
                                <div class="pop_detail">
                                    <form class="xtx_form">
                                        <div class="form_item">
                                            <label for="">收货人：</label>
                                            <input type="text" placeholder="请输入收货人" name="username">
                                            <span></span>
                                        </div>
                                        <div class="form_item">
                                            <label for="">手机号：</label>
                                            <input type="text" placeholder="请输入手机号" name="phone">
                                            <span></span>
                                        </div>
                                        <div class="form_item">
                                            <label for="">地址:</label>
                                            <div class="box_address">
                                                <select name="province" id="province">
                                                    <option value="">---请选择---</option>
                                                </select>
                                                <select name="city" id="city">
                                                    <option value="">---请选择---</option>
                                                </select>
                                                <select name="district" id="district">
                                                    <option value="">---请选择---</option>
                                                </select>
                                            </div>
                                            <span></span>
                                        </div>
                                        <div class="form_item">
                                            <label for="">详细地址:</label>
                                            <input type="text" placeholder="请输入详细地址" name="totalAdd">
                                            <span></span>
                                        </div>
                                        <div class="pop_footer">
                                            <button class="btn_cancel" data-name="cancel">取消</button>
                                            <button class="btn_confirm" data-name="confirm">确认</button>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                        <div class="exchange">
                            <div class="pop_con">
                                <div class="pop_title">
                                    <h3>切换收货地址</h3>
                                    <i class="exchange_cancel">X</i>
                                </div>
                                <div class="pop_detail">
                                    <form class="exchange_form">
                                        <div class="list_body" data-name="list">

                                        </div>
                                        <div class="pop_footer">
                                            <button class="btn_cancel exchange_btncancel" data-name="cancel">取消</button>
                                            <button class="btn_confirm" data-name="confirm">确认</button>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                        <div class="updata">
                            <div class="pop_con">
                                <div class="pop_title">
                                    <h3>修改收货地址</h3>
                                    <i class="cancel up_can">X</i>
                                </div>
                                <div class="pop_detail">
                                    <form class="xtx_form up_form">
                                        <div class="form_item">
                                            <label for="">收货人：</label>
                                            <input type="text" placeholder="请输入收货人" name="up_username">
                                            <span></span>
                                        </div>
                                        <div class="form_item">
                                            <label for="">手机号：</label>
                                            <input type="text" placeholder="请输入手机号" name="up_phone">
                                            <span></span>
                                        </div>
                                        <div class="form_item">
                                            <label for="">地址:</label>
                                            <div class="box_address">
                                                <select name="up_province" id="up_province">
                                                    <option value="">---请选择---</option>
                                                </select>
                                                <select name="up_city" id="up_city">
                                                    <option value="">---请选择---</option>
                                                </select>
                                                <select name="up_district" id="up_district">
                                                    <option value="">---请选择---</option>
                                                </select>
                                            </div>
                                            <span></span>
                                        </div>
                                        <div class="form_item">
                                            <label for="">详细地址:</label>
                                            <input type="text" placeholder="请输入详细地址" name="up_totalAdd">
                                            <span></span>
                                        </div>
                                        <div class="pop_footer">
                                            <button class="btn_cancel up_cancel" data-name="cancel">取消</button>
                                            <button class="btn_confirm up_confirm" data-name="confirm">确认</button>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- 商品列表 -->
                <div class="xtx_shoplist">
                    <h3 class="box_title">商品信息</h3>
                    <div class="box_body">
                        <table>
                            <thead>
                                <tr>
                                    <th>商品信息</th>
                                    <th>单价</th>
                                    <th>数量</th>
                                    <th>小计</th>
                                    <th>实付</th>
                                </tr>
                            </thead>
                            <tbody>
                                <!-- <tr>
                                    <td>
                                        <a href="jacascript:;">
                                            <div class="left_pic">
                                                <img src="../images/qrcode.jpg" alt="">
                                            </div>
                                            <div class="shoptext">
                                                <p>厚厚一按就干爽，埃及进口长绒棉毛巾</p>
                                                <p>规格：</p>
                                            </div>
                                        </a>
                                    </td>
                                    <td>￥<i>99.00</i></td>
                                    <td>2</td>
                                    <td>￥<i>99.00</i></td>
                                    <td>￥<i>99.00</i></td>
                                </tr> -->
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="xtx_delivery">
                    <h3 class="box_title">配送信息</h3>
                    <div class="box_body">
                        <a href="jacascript:;" class="xtx_btn active">不限送货时间：周一至周日</a>
                        <a href="jacascript:;" class="xtx_btn">工作日送货：周一至周五</a>
                        <a href="jacascript:;" class="xtx_btn">双休日、假日送货：周六至周日</a>
                    </div>
                </div>
                <div class="xtx_pay">
                    <h3 class="box_title">支付信息</h3>
                    <div class="box_body">
                        <a href="jacascript:;" class="xtx_btn active">在线支付</a>
                        <a href="jacascript:;" class="xtx_btn">货到付款</a>
                        <a href="jacascript:;" class="xtx_btn">货到付款需付5元手续费</a>
                    </div>
                </div>
                <div class="xtx_amout">
                    <h3 class="box_title">金额明细</h3>
                    <div class="box_body">
                        <dl>
                            <dt>商品件数：</dt>
                            <dd><i class="shop_count"></i>件</dd>
                        </dl>
                        <dl>
                            <dt>商品总价：</dt>
                            <dd>￥<i class="shop_amount"></i></dd>
                        </dl>
                        <dl>
                            <dt>运&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;费：</dt>
                            <dd>￥0.00</dd>
                        </dl>
                        <dl>
                            <dt>应付总额：</dt>
                            <dd>￥<i class="shop_pay"></i></dd>
                        </dl>
                    </div>
                </div>
                <div class="submit">
                    <button class="xtx_submit">提交订单</button>
                </div>
            </div>
        </div>
    </section>

    <!-- 公共底部 -->
    <div class="xtx_footer clearfix">
        <div class="wrapper">
            <!-- 联系我们 -->
            <div class="contact clearfix">
                <dl>
                    <dt>客户服务</dt>
                    <dd class="chat">在线客服</dd>
                    <dd class="feedback">问题反馈</dd>
                </dl>
                <dl>
                    <dt>关注我们</dt>
                    <dd class="weixin">公众号</dd>
                    <dd class="weibo">微博</dd>
                </dl>
                <dl>
                    <dt>下载APP</dt>
                    <dd class="qrcode">
                        <img src="../images/qrcode.jpg">
                    </dd>
                    <dd class="download">
                        <span>扫描二维码</span>
                        <span>立马下载APP</span>
                        <a href="javascript:;">下载页面</a>
                    </dd>
                </dl>
                <dl>
                    <dt>服务热线</dt>
                    <dd class="hotline">
                        400-0000-000
                        <small>周一至周日 8:00-18:00</small>
                    </dd>
                </dl>
            </div>
        </div>
        <!-- 其它 -->
        <div class="extra">
            <div class="wrapper">
                <!-- 口号 -->
                <div class="slogan">
                    <a href="javascript:;" class="price">价格亲民</a>
                    <a href="javascript:;" class="express">物流快捷</a>
                    <a href="javascript:;" class="quality">品质新鲜</a>
                </div>
                <!-- 版权信息 -->
                <div class="copyright">
                    <p>
                        <a href="javascript:;">关于我们</a>
                        <a href="javascript:;">帮助中心</a>
                        <a href="javascript:;">售后服务</a>
                        <a href="javascript:;">配送与验收</a>
                        <a href="javascript:;">商务合作</a>
                        <a href="javascript:;">搜索推荐</a>
                        <a href="javascript:;">友情链接</a>
                    </p>
                    <p>CopyRight &copy; 小兔鲜儿</p>
                </div>
            </div>
        </div>
    </div>
    <script src="../js/areaJson.js"></script>
    <script src="../js/common.js"></script>
    <script src="../js/settle.js"></script>

</body>

</html>